import React,{createContext,Fragment,useEffect,useState,useContext,useReducer,useMemo,useRef,useImperativeHandle,useLayoutEffect} from 'react'
function init() {
    return {count: 1};
  }
  
  function reducer(state, action) {
    switch (action.type) {
      case 'increment':
        return {count: state.count + 1};
      case 'decrement':
        return {count: state.count - 1};
      case 'reset':
        return init();
      default:
        return {count: 1}
    }
  }
  
  function Counter({initialCount}) {
      const [index] = useState(1)
      useEffect(()=>{
          console.log(initialCount)
      })
    const [state, dispatch] = useReducer(reducer, initialCount, init);
    return (<div>
        Count: {state.count}
        <button
          onClick={() => dispatch({type: 'reset'})}>
          Reset
        </button>
        <button onClick={() => dispatch({type: 'decrement'})}>-</button>
        <button onClick={() => dispatch({type: 'increment'})}>+</button>
    </div>)
    
  }

export default Counter